<!DOCTYPE html>
<html>
<head>
    <title>数据便签 - 错误页面</title>
    <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate">
    <meta http-equiv="Pragma" content="no-cache">
    <meta http-equiv="Expires" content="0">
    <link href="/static/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="/static/css/bootstrap-icons.css">
    <link rel="stylesheet" href="/static/css/style.css">
    <link rel="stylesheet" href="/static/css/records-table.css">
    <link rel="shortcut icon" href="/static/images/favicon.ico">
</head>
<body>
    <div class="container-fluid">
        <!-- 导航按钮 -->
        <div class="action-buttons btn-group-spacing mt-3">
            <a href="/" class="btn btn-sm btn-outline-primary">
                <i class="bi bi-house-door"></i> 返回首页
            </a>
            <a href="/" class="btn btn-sm btn-outline-primary">
                <i class="bi bi-plus-circle"></i> 新建
            </a>
            <button class="btn btn-sm btn-outline-secondary" onclick="window.location.reload()">
                <i class="bi bi-arrow-clockwise"></i> 刷新
            </button>
        </div>

        <!-- 主内容区 -->
        <div class="row justify-content-center mt-5">
            <div class="col-md-8 col-lg-6 text-center">
                <!-- 错误图标 -->
                <div class="mb-4">
                    <i class="bi bi-exclamation-triangle-fill text-danger" style="font-size: 5rem;"></i>
                </div>
                
                <!-- 标题 -->
                <h1 class="mb-3 text-danger">发生错误</h1>
                
                <!-- 错误详情卡片 -->
                <div class="card border-danger mb-4">
                    <div class="card-body text-start">
                        <h5 class="card-title">系统处理您的请求时遇到问题</h5>
                        <p class="card-text">
                            {{if .error}}
                                <code>{{.error}}</code>
                            {{else}}
                                未知错误
                            {{end}}
                        </p>
                        
                        <div class="alert alert-light mt-3">
                            <p>您可以尝试：</p>
                            <ul>
                                <li>稍后再试</li>
                                <li>检查您的操作是否正确</li>
                                <li>联系管理员报告此问题</li>
                            </ul>
                        </div>
                    </div>
                </div>
                
                <!-- 操作按钮 -->
                <div class="d-grid gap-2 d-md-flex justify-content-md-center mb-5">
                    <a href="/" class="btn btn-primary me-md-2">
                        <i class="bi bi-house-door"></i> 返回首页
                    </a>
                    <a href="javascript:history.back()" class="btn btn-outline-secondary">
                        <i class="bi bi-arrow-left"></i> 返回上一页
                    </a>
                </div>
            </div>
        </div>
    </div>

    <!-- 页脚 -->
    {{ template "footer.html" . }}
    <!-- JavaScript -->
    <script src="/static/js/bootstrap.bundle.min.js"></script>
</body>
</html>